<template>
  <div class="msg-state">
    <nav-header
      :headerTitle="headTitle"
      :navBgColor="'#fff'"
      :isNext="false"
      :isNavBack="true"
      :isNedMsg="false"
    ></nav-header>
    <div class="content">
      <div class="task-count-down">
        <task-count-down :courseItem="item"></task-count-down>
      </div>
      <div class="task-list">
        <task-list-item :listItem="item" :pageName="'msgState'"></task-list-item>
      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
import mixin from '@/utils/mixin'
import NavHeader from '@/components/NavHeader'
import TaskCountDown from '@/components/TaskCountDown'
import TaskListItem from '@/components/TaskListItem'

export default {
  name: 'msgState',
  mixins: [mixin],
  data () {
    return {
      inuniqueId: '',
      adId: '',
      item: {},
      headTitle: ''
    }
  },
  computed: {
    // item () {
    //   this.getTaskInfoByForwardId()
    // }
  },
  mounted () {
    let query = this.$route.query
    if (query) {
      this.inuniqueId = query.inuniqueId
      this.adId = query.adId
    }
    // this.getInuniqueId()
    this.getTaskInfoByForwardId()
  },
  methods: {
    // 获取用户uniqueId
    // getInuniqueId () {
    //   if (localStorage.getItem('uniqueIdByInfluencer') === null) {
    //     this.inuniqueId = ''
    //     return false
    //   }
    //   this.inuniqueId = localStorage.getItem('uniqueIdByInfluencer')
    // },
    // 获取任务详情
    getTaskInfoByForwardId () {
      this.$http.post('/flowForward/getTaskInfoByForwardId', {
        uniqueId: this.inuniqueId,
        adId: this.adId
      }).then(
        res => {
          let resData = res.data
          this.item = resData
          if (resData.forwardAuditStatus === 2) {
            this.headTitle = '任务完成'
          } else if ([4, 5, 6].includes(resData.forwardAuditStatus)) {
            this.headTitle = '任务失败'
          } else {
            return false
          }
        },
        err => {
          console.log(err)
        }
      )
    }
  },
  components: {
    NavHeader,
    TaskCountDown,
    TaskListItem
  }
}
</script>

<style scoped lang="scss">
@import '~@/assets/css/common.scss';
.msg-state {
  width: 100%;
  height: 100%;
  padding: 0 32px;
  box-sizing: border-box;
  .content {
    width: 100%;
    height: 100%;
    margin-top: 112px;
  }
}
</style>
